<template>
  <div class="app-container">
    <div class="flex">
      <el-input
        v-model="minuend_value"
        class="mr-2"
        type="textarea"
        placeholder="请输入被减数"
        maxlength="10000"
        rows="20"
        show-word-limit
        @input="handleInputMinuend"
      >
      </el-input>
      <el-input
        v-model="subtrahend_value"
        type="textarea"
        placeholder="请输入减数"
        maxlength="10000"
        rows="20"
        show-word-limit
        @input="handleInputSubtrahend"
      >
      </el-input>
    </div>
    <pre>Minuend ({{ minuendListLen }})    {{ minuendListStr }}</pre>
    <pre>Subtrahend ({{ subtrahendListLen }})    {{ subtrahendListStr }}</pre>
    <pre>Intersection ({{ intersectionListLen }})    {{ intersectionListStr }}</pre>
    <pre>Difference ({{ differenceListLen }})    {{ differenceListStr }}</pre>
  </div>
</template>
<script>
import _ from 'lodash'
import { getRemainingNumbers } from '@/utils/study'

export default {
  name: 'MinusPage',
  data() {
    return {
      // 被减数 输入框的值
      minuend_value: '',
      // 被减数 数组
      minuend_list: Array.from({ length: 49 }, (_, i) => i + 1).map((num) => (num < 10 ? `0${num}` : `${num}`)),

      // 减数 输入框的值
      subtrahend_value: '',
      // 减数 数组
      subtrahend_list: [],

      // 差值数组
      difference_list: [],
      // 交集数组
      intersection_list: []
    }
  },
  computed: {
    minuendListLen() {
      return this.minuend_list.length
    },
    minuendListStr() {
      return this.minuendListLen ? JSON.stringify(this.minuend_list).replace(/[\n\s]/g, '') : '[]'
    },

    subtrahendListLen() {
      return this.subtrahend_list.length
    },
    subtrahendListStr() {
      return this.subtrahendListLen ? JSON.stringify(this.subtrahend_list).replace(/[\n\s]/g, '') : '[]'
    },

    differenceListLen() {
      return this.difference_list.length
    },
    differenceListStr() {
      return this.differenceListLen ? JSON.stringify(this.difference_list).replace(/[\n\s]/g, '') : '[]'
    },

    intersectionListLen() {
      return this.intersection_list.length
    },
    intersectionListStr() {
      return this.intersectionListLen ? JSON.stringify(this.intersection_list).replace(/[\n\s]/g, '') : '[]'
    }
  },
  methods: {
    processInput(input) {
      // 如果输入为空，直接返回空数组
      if (!input) {
        return []
      }

      // 正则表达式：匹配所有方括号中的内容
      const numbers = input.match(/\[([^\]]+)\]/g)

      if (!numbers) {
        return []
      }

      // 提取方括号内的数字（包括字符串形式的数字）
      const uniqueNumbers = _.chain(numbers)
        .map((str) => {
          // 提取每个方括号内的所有数字，包括字符串数字
          const matches = str.match(/["']?(\d+)["']?/g)

          // 如果没有匹配到任何数字，返回空数组
          if (!matches) {
            return []
          }

          // 移除数字前后的引号
          return matches.map((numStr) => numStr.replace(/["']/g, ''))
        })
        .flatten() // 展开嵌套的数组
        .map(Number) // 转换为数字
        .uniq() // 去重
        .sort((a, b) => a - b) // 升序排序
        .map((num) => num.toString().padStart(2, '0')) // 补零
        .value()

      // 返回处理后的结果
      // return JSON.stringify(uniqueNumbers).replace(/[\n\s]/g, '')
      return uniqueNumbers
    },
    // 处理输入数组
    handleInputArrays() {
      this.killList = this.processInput(this.minuend_value)
      this.luckyList = getRemainingNumbers(this.killList)

      navigator.clipboard.writeText(`
        Kill (${this.killListLen})：   ${JSON.parse(this.killListStr).join(', ')}
        Lucky (${this.luckyListLen})：  ${JSON.parse(this.luckyListStr).join(', ')}
      `)
    },
    // 处理被减数
    handleInputMinuend() {
      this.minuend_list = this.processInput(this.minuend_value)
      this.handleCalcDifference()
    },
    // 处理减数
    handleInputSubtrahend() {
      this.subtrahend_list = this.processInput(this.subtrahend_value)
      if (this.subtrahendListLen && this.minuend_list.length === 49) {
        // 计算差值
        // this.difference_list = this.minuend_list.filter((num) => !this.subtrahend_list.includes(num))

        // 更新被减数列表为差值列表
        // this.minuend_list = this.difference_list

        this.minuend_list = this.minuend_list.filter((num) => !this.subtrahend_list.includes(num))
      }
      this.handleCalcDifference()
    },
    // 计算差值
    handleCalcDifference() {
      // 计算差值
      this.difference_list = this.minuend_list.filter((num) => !this.subtrahend_list.includes(num))
      // 计算交集
      this.intersection_list = this.minuend_list.filter((num) => this.subtrahend_list.includes(num))
      navigator.clipboard.writeText(`
        Minuend (${this.minuendListLen})    ${this.minuendListStr}
        Subtrahend (${this.subtrahendListLen})    ${this.subtrahendListStr}
        Intersection (${this.intersectionListLen})    ${this.intersectionListStr}
        Difference (${this.differenceListLen})    ${this.differenceListStr}
      `)
    }
  }
}
</script>
